<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>firstChild,firstElementChild,lastChild,lastElementChild </title>

<script type="text/javascript">
    window.onload=function(){
        var oUl=document.getElementById('ul1');
        if(oUl.firstElementChild){//高级浏览器适用
            oUl.firstElementChild.style.background='#f0f';
        }else{//低级浏览器适用
            oUl.firstChild.style.background='#f00';
        }

        if(oUl.lastElementChild){//高级浏览器适用
            oUl.lastElementChild.style.background='#ff0';
        }else{//低级浏览器适用
            oUl.lastChild.style.background='#0ff';
        }
    };
</script>    

</head>
<body>
    <ul id="ul1">
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
    </ul>
</body>
</html>